<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">
    <f:view contentType="text/html">
        <h:head>
            <f:facet name="first">
                <meta http-equiv="X-UA-Compatible" content="EmulateIE8" />
                <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
                <title>PrimeFaces - ShowCase</title>
            </f:facet>

            <link type="text/css" rel="stylesheet" href="#{request.contextPath}/css/syntaxhighlighter/syntaxhighlighter.css" />
            <style type="text/css">
                body {
                    margin:0;
                    padding: 0;
                    background-color: #CEE3F6;
                }
            </style>
        </h:head>

        <h:body>

            <p:dock id="dockTop" position="top">
                <p:menuitem id="top0" value="Home" icon="/images/dock/home.png" url="#"/>
                <p:menuitem id="top1" value="Music" icon="/images/dock/music.png" url="#"/>
                <p:menuitem id="top2" value="Video" icon="/images/dock/video.png" url="#"/>
                <p:menuitem id="top3" value="Email" icon="/images/dock/email.png" url="#"/>
                <p:menuitem id="top4" value="Portfolio" icon="/images/dock/portfolio.png" url="#"/>
                <p:menuitem id="top5" value="Link" icon="/images/dock/link.png" url="#"/>
                <p:menuitem id="top6" value="RSS" icon="/images/dock/rss.png" url="#"/>
                <p:menuitem id="top7" value="History" icon="/images/dock/history.png" url="#"/>
            </p:dock>

            <pre name="code" class="xml">
&lt;p:dock position="top"&gt;
	&lt;p:menuitem value="Home" icon="/images/dock/home.png" url="#"/&gt;
	&lt;p:menuitem value="Music" icon="/images/dock/music.png" url="#"/&gt;
	&lt;p:menuitem value="Video" icon="/images/dock/video.png" url="#"/&gt;
	&lt;p:menuitem value="Email" icon="/images/dock/email.png" url="#"/&gt;
	&lt;p:menuitem value="Portfolio" icon="/images/dock/portfolio.png" url="#"/&gt;
	&lt;p:menuitem value="Link" icon="/images/dock/link.png" url="#"/&gt;
	&lt;p:menuitem value="RSS" icon="/images/dock/rss.png" url="#"/&gt;
	&lt;p:menuitem value="History" icon="/images/dock/history.png" url="#"/&gt;
&lt;/p:dock&gt;
	
&lt;p:dock&gt;
	&lt;p:menuitem value="Home" icon="/images/dock/home.png" url="#"/&gt;
	&lt;p:menuitem value="Music" icon="/images/dock/music.png" url="#"/&gt;
	&lt;p:menuitem value="Video" icon="/images/dock/video.png" url="#"/&gt;
	&lt;p:menuitem value="Email" icon="/images/dock/email.png" url="#"/&gt;
	&lt;p:menuitem value="Portfolio" icon="/images/dock/portfolio.png" url="#"/&gt;
	&lt;p:menuitem value="Link" icon="/images/dock/link.png" url="#"/&gt;
	&lt;p:menuitem value="RSS" icon="/images/dock/rss.png" url="#"/&gt;
	&lt;p:menuitem value="History" icon="/images/dock/history.png" url="#"/&gt;
&lt;/p:dock&gt;
            </pre>

            <p:dock id="dockBottom">
                <p:menuitem id="bottom0" value="Home" icon="/images/dock/home.png" url="#" />
                <p:menuitem id="bottom1" value="Music" icon="/images/dock/music.png" url="#" />
                <p:menuitem id="bottom2" value="Video" icon="/images/dock/video.png" url="#"/>
                <p:menuitem id="bottom3" value="Email" icon="/images/dock/email.png" url="#"/>
                <p:menuitem id="bottom4" value="Portfolio" icon="/images/dock/portfolio.png" url="#"/>
                <p:menuitem id="bottom5" value="Link" icon="/images/dock/link.png" url="#"/>
                <p:menuitem id="bottom6" value="RSS" icon="/images/dock/rss.png" url="#"/>
                <p:menuitem id="bottom7" value="History" icon="/images/dock/history.png" url="#"/>
            </p:dock>

        </h:body>
        
        <script language="javascript" src="#{request.contextPath}/syntaxhighlighter/scripts/sh.js"></script>
		<script language="javascript">
			dp.SyntaxHighlighter.ClipboardSwf = '#{request.contextPath}/syntaxhighlighter/scripts/clipboard.swf';
			dp.SyntaxHighlighter.HighlightAll('code');
		</script>

    </f:view>
</html>